<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="js/axios.js"></script>
    
    <link rel="stylesheet" href="css/detail.css">
    <link rel="stylesheet" href="css/newbootstrap.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/aaaa.css">
</head>
<script src="js/index.js"></script>
<body>
<div id="headerTop">
    <div id="headerTop-next">
        <p>
            <a href="#">E宠首页</a>
        </p>
        <div class="songZ">送至：</div>
        <div class="diZ">北京</div>
        <p>
            <a href="#">E宠就是正品</a>
        </p>
    </div>
    <ul id="headerTop-Right">
        <li><a href="#">问题反馈</a></li>
        <li><i></i><a href="#">手机版</a></li>
        <li><i></i><a href="#">收藏</a><b></b></li>
        <li><i></i><a href="#">我的E宠</a><b></b></li>
        <li><i></i><a href="#">购物车(<span>0</span>)</a></li>
        <li><a href="#">[注册]</a></li>
        <li><a href="#">[登录]</a></li>
    </ul>
</div>
<div id="header-wrapper">
    <div id="header">
        <div id="header-logo">
            <a href="#"></a>
        </div>
        <div id="header-search">
            <div id="header-search-form">
                <input type="text" name="keyword" placeholder="K9Natural">
                <input type="button" value="搜索">
            </div>
            <div id="header-search-keyword">
                <label>热门搜索：</label>
                <a href="#">拜耳</a>
                <span>|</span>
                <a href="#">伯纳天地</a>
                <span>|</span>
                <a href="#">冠能</a>
                <span>|</span>
                <a href="#">麦德士</a>
                <span>|</span>
                <a href="#">粑粑抓</a>
            </div>
        </div>
        <div id="header-cart">
            <a href="#">购物车(<span>0</span>)</a>
        </div>
    </div>
</div>
<div id="nav">
    <div id="nav-main">
        <div id="nav-main-L">
            <span><a href="#">狗狗</a><b></b></span>
            <span>商品分类<b></b></span>
            
        </div>
        <ul id="nav-main-R">
            <li><a href="#"><b></b>品牌特卖</a></li>
            <li><a href="#"><b></b>潮品视频</a></li>
            <li><a href="#"><b></b>小剧场</a></li>
            <li><a href="#"><b></b>E宠课堂</a></li>
            <li><a href="#"><b></b>萌爪联盟</a></li>
            <li><a href="#"><b></b>清仓特价</a></li>
        </ul>
        <div id="nav-main-LD">
            <div id="LD-R">
                <ul>
                    <li>
                        <h3><a href="#">主粮</a><a href="#">零食</a></h3>
                        <div id="abox">
                            <div id="abox-1">
                                <div id="abox-1-top">
                                    <img src="img/狗狗主粮1.jpg" alt="">
                                    <a href="#">狗狗主粮</a>
                                    <i></i>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-mid_head">
                                    <a href="#">进口狗粮</a>
                                    <img src="img/abox-1-mid_head.jpg" alt="">
                                </div>
                                <div id="abox-1-mid_list">
                                    <a href="#">小型犬专用</a>
                                    <a href="#">大型犬专用</a>
                                    <a href="#">大型犬幼犬专用</a>
                                    <a href="#">夏日清火</a>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-mid_head">
                                    <a href="#">国产狗粮</a>
                                    <img src="img/abox-1-mid_head.jpg" alt="">
                                </div>
                                <div id="abox-1-mid_list">
                                    <a href="#">小型犬专用</a>
                                    <a href="#">大型犬专用</a>
                                    <a href="#">大型犬幼犬专用</a>
                                    <a href="#">夏日清火</a>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-mid_head">
                                    <a href="#">国产狗粮</a>
                                    <img src="img/abox-1-mid_head.jpg" alt="">
                                </div>
                                <div id="abox-1-mid_list">
                                    <a href="#">小型犬专用</a>
                                    <a href="#">大型犬专用</a>
                                    <a href="#">大型犬幼犬专用</a>
                                    <a href="#">夏日清火</a>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-top">
                                    <img src="img/狗狗主粮1.jpg" alt="">
                                    <a href="#">狗狗主粮</a>
                                    <i></i>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-mid_head">
                                    <a href="#">进口狗粮</a>
                                    <img src="img/abox-1-mid_head.jpg" alt="">
                                </div>
                                <div id="abox-1-mid_list">
                                    <a href="#">小型犬专用</a>
                                    <a href="#">大型犬专用</a>
                                    <a href="#">大型犬幼犬专用</a>
                                    <a href="#">夏日清火</a>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-mid_head">
                                    <a href="#">国产狗粮</a>
                                    <img src="img/abox-1-mid_head.jpg" alt="">
                                </div>
                                <div id="abox-1-mid_list">
                                    <a href="#">小型犬专用</a>
                                    <a href="#">大型犬专用</a>
                                    <a href="#">大型犬幼犬专用</a>
                                    <a href="#">夏日清火</a>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-mid_head">
                                    <a href="#">国产狗粮</a>
                                    <img src="img/abox-1-mid_head.jpg" alt="">
                                </div>
                                <div id="abox-1-mid_list">
                                    <a href="#">小型犬专用</a>
                                    <a href="#">大型犬专用</a>
                                    <a href="#">大型犬幼犬专用</a>
                                    <a href="#">夏日清火</a>
                                </div>
                                <div id="abox-1-2"></div>
                                <div id="abox-1-mid_head">
                                    <a href="#">国产狗粮</a>
                                    <img src="img/abox-1-mid_head.jpg" alt="">
                                </div>
                                <div id="abox-1-mid_list">
                                    <a href="#">小型犬专用</a>
                                    <a href="#">大型犬专用</a>
                                    <a href="#">大型犬幼犬专用</a>
                                    <a href="#">夏日清火</a>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li><h3><a href="#">窝垫</a><a href="#">玩具</a></h3></li>
                    <li><h3><a href="#">清洁</a><a href="#">保健</a></h3></li>
                    <li><h3><a href="#">护理</a><a href="#">生活</a></h3></li>
                    <li><h3><a href="#">牵引</a><a href="#">洗澡</a></h3></li>
                    <li><h3><a href="#">服饰</a><a href="#">美容</a></h3></li>
                </ul>
                <p>
                    <img src="img/nav-LD.png">
                    正在进行的品牌热卖
                    <a>52</a>
                </p>
            </div>
            <dl id="LD-L">
                <dd id="LD-L-dog">
                    <a href="#"><span></span></a>
                    <span class="LD-L-d">
                        <p><b>5401</b>种精选宝贝</p>
                        <a href="#">正在狗狗站溜达</a>  
                    </span> 
                    <a href="#"><img src="img/dogpack.jpg" alt=""></a>
                </dd>
                <dd id="LD-L-cat">
                    <a href="#"><span></span></a>
                    <span class="LD-L-cat">
                        <p><b>3806</b>种精选宝贝</p>
                        <a href="#">切换到猫猫站</a>
                    </span>
                    <a href="#"><img src="img/catpack.jpg"></a>
                </dd>
            </dl>
        </div>
    </div>
</div>
<div id="detail-main">
    <div id="detail-main-top">    
            <div>
                <span>狗狗</span>
                <b></b>
            </div>
            <label></label>
            <div>
                <span>狗狗主粮</span>
                <b></b>
            </div>
            <label></label>
            <div>
                <span>进口狗粮</span>
                <b></b>   
    </div>
    
</div>
    <div id="detail-main-middle">
        <!-- 左边图片 -->
        <div id="detail-Mmain-L">
            <div id="Midarea">
                <img src="img/detail-Mmain-L.jpg" alt="">
                <div id="zoom"></div>
            </div>
            <div id="Bigarea">
                <img src="img/detail-Mmain-L.jpg">
            </div>
            
            <script src="js/Zoom.js"></script>
    <script>
        new Zoom();
    </script>    
        </div>
        <div id="detail-Mmain-R">
            <h1>【2021年5月到期】 比利时原装进口 欧帝亿IMPERIAL PAW 小型犬成犬鸡肉配方粮 7.5kg</h1>
            <div id="detail-Mmain-R-text1">易吸收 调节食欲 符合小型成犬的成长营养需求</div>
            <div id="detail-Mmain-Rprice">
                <div>&nbsp;&nbsp;此商品参与“折扣”活动</div>
                <div id="detail-Mmain-Rprice2">
                    <span>活动价：</span>
                    <span>￥</span>
                    <span>406.00</span>
                </div>
            </div>
            <div id="detail-Mmain-Rgdtable">
                <div id="detail-Mmain-Rgdtable1">
                    <div>
                        <span>月销：</span>
                        <span>78</span>袋
                    </div>
                    <div>
                        <span>评价：</span>
                        <span>（1012）</span>
                    </div>
                    <div>
                        <span>咨询：</span>
                        <span>（236）</span>
                    </div>
                </div>
                <div id="cats"><a href="cat.html">加入购物车</a></div>
            </div>
        </div>
    </div>
    <div id="detail-main-bottom"></div>
</div>
<div id="footer">
    <div id="footer-top">
        <div id="footer-top-img">
            <ul class="footer-list">
                <li class="fl"><a class="zp" href="">正品保障</a></li>
                <li class="fl"><a class="ck"href="">品类丰富</a></li>
                <li class="fl"><a class="ps"href="">优质服务</a></li>
                <li class="fl"><a class="hh"href="">科学养宠</a></li>
                <li class="fl"><a class="bs"href="">E宠公益</a></li>
                <li class="fl"><a class="cj"href="">十年同心</a></li>
            </ul>
        </div>
    </div>
    <div id="footer-wrapper">
        <div id="ft-wrapper-top">
            <div id="ft-wrapper-topL">
                <img src="img/dog_phone.gif">
                <div id="ft-wrapper-number">
                    <h2 class="ft-number">售后电话</h2>
                    <p class="c660">4008889200<span class="m10">免费长途</span></p>
                    <p class="c660">023-68851700</p>
                    <p class="c440">服务时间：09:00--18:30(周一到周日)</p>
                </div>
            </div>
            <div id="ft-wrapper-topPay">
                <h2>购物指南</h2>
                <p class="topPay-p"><a href="#">新人优惠</a></p>
                <p class="topPay-p"><a href="#">购物问题</a></p>
                <p class="topPay-p"><a href="#">支付问题</a></p>
            </div>
            <div id="ft-wrapper-topShop">
                <h2>售后服务</h2>
                <p class="topShop-s"><a href="#">退换货问题</a></p>
                <p class="topShop-s"><a href="#">退款说明</a></p>
                <p class="topShop-s"><a href="#">售后问题</a></p>
            </div>
            <div id="ft-wrapper-topApp">
                <p class="topApp-a">扫码下载APP</p>
                <p class="topApp-a">下单更优惠</p>
                <a href="#">
                    <img src="img/dw2.png" alt="">
                </a>
            </div>
            <div id="ft-wrapper-topWx">
                <p class="topWx-w">扫码关注E宠</p>
                <p class="topWx-w">微信商城</p>
                <a href="#">
                    <img src="img/app-code.jpg" alt="">
                </a>
            </div>
        </div>
        <div id="ft-wrapper-Tnext">
            <div id="Tnext-wrapper">
                <span id="Tnext-wrapper-S">
                    <a href="#">关于我们</a>
                    <a href="#"><img src="img/weibo_logo.png">
                        E宠商城</a>
                    <a href="#"><img src="img/weixin_logo.png" >
                        E宠商城</a>
                    <a href="#"><img src="img/baidu_log.png" >
                        E宠商城百家号</a>
                    <a href="#"><img src="img/toutiao_logo.png">
                        E宠说</a>
                    <a href="#">E宠公益</a>
                    <a href="#">联系我们</a>
                    <a href="#">公司地址</a>
                    <a href="#">应急响应</a>
                    <a href="#">仓储中心</a>
                    <a href="#">用户协议</a>
                </span>
            </div>
        </div>
        <div id="ft-wrapper-support">
            <a href="#"><img src="img/12315.png" alt=""></a>
            <a href="#"><img src="img/360.png" alt=""></a>
            <a href="#"><img src="img/chengxin.png" alt=""></a>
            <a href="#"><img src="img/shiming.png" alt=""></a>
            <a href="#"><img src="img/tx.png" alt=""></a>
            <a href="#"><img src="img/jybz.png" alt=""></a>
            <a href="#"><img src="img/cqgs.png" alt=""></a>
            <span><img src="img/baiq.png" alt=""></span>
            <span><img src="img/wsls.png" alt=""></span>
            <span><img src="img/sfqy.png" alt=""></span>
            <span><img src="img/yxqy.png" alt=""></span>
            <span><img src="img/bhdw.png" alt=""></span>
            <span><img src="img/sjws.png" alt=""></span>
        </div>
        
        <div id="ft-wrapper-footer">
            <p>
                <a href="#">渝ICP备10002905号-3</a>
                <a href="#">营业执照</a>
                <a href="#">兽药经营许可证</a>
                　增值电信业务经营许可证：渝B2-20140042 Copyright © 2007-2020 epet.com 　重庆易宠科技有限公司
            </p>
        </div>
    </div>
</div>
<div id="rtcont">
    <ul id="rtcont-1">
        <li><a href="#"></a></li>
        <li><a href="#"></a></li>
        <li></li>
    </ul>
    <ul id="rtcont-2">
        <a id="rtcont-2-1" href="#"></a>
    </ul>
</div>
<script src="js/jquery.js"></script>
<script>
    $(function() {
        $("#rtcont-2-1").hide();
        $(window).bind('scroll',function(){
            if($(window).scrollTop()<=300){
                $("#rtcont-2-1").hide();
           	}else{
                $("#rtcont-2-1").show();
            }
        });
        $("#rtcont-2-1").bind("click",function(){
            $('html, body').animate({scrollTop: 0},500);
        });
   });
   $(function(){
       $("#misc-con").hide();
        $("#headerTop-Right li:eq(6) a").click(function(){
            $("#misc-con").show();
        }); 
        $("#stop").click(function(){
        $("#misc-con").hide();
       })
   });
   $(function(){
     $("#register-con").hide();
        $("#headerTop-Right li:eq(5) a").click(function(){
            $("#register-con").show();
        }); 
       $("#stop").click(function(){
        $("#register-con").hide();
       })
   })
</script>
    <div id="misc-con">
        <div id="misc-con-main">
            <p>
                <span>手机验证码登录</span>
                <span>|</span>
                <span>账户登录</span>
            </p>
            <div>
                <span></span>
                <input id="misc-n" type="text" placeholder="请输入手机号">
            </div>
            <div>
                <span></span>
                <input id="misc-p" type="text" placeholder="请输入密码">
            </div>
            <div id="misc-b">登录</div>
        </div>
    </div>
    <div id="register-con">
        <span id="stop"></span>
        <div id="register-con-main">
            <p>
                <span>新用户注册</span>
                <span>|</span>
                <span>直接登录</span>
            </p>
            <div>
                <span></span>
                <input id="register-n" type="text" placeholder="请输入手机号">
            </div>
            <div>
                <span></span>
                <input id="register-p" type="text" placeholder="请输入密码">
            </div>
            <div id="register-b">注册</div>
        </div>
    </div>
    <script src="js/axios.js"></script>
    <script>
        let Ldr = document.getElementById('LD-R')
        let Navmain = document.getElementById('nav-main-L')
        Ldr.style.display = "none"
        Navmain.onmouseover = function(){
            Ldr.style.display = "block"
        }
        Navmain.onmouseout = function(){
            Ldr.style.display = "none"
        }
    </script>
    <script>
        let ipts = document.getElementById("register-b");
         ipts.onclick = function(){
             let username = document.getElementById("register-n").value
             let password = document.getElementById("register-p").value
             let regAPI = 'http://jx.xuzhixiang.top/ap/api/reg.php'
            axios.get(regAPI,{
                params:{
                    username,
                    password
                }
            }).then(function(res){
                //请求成功
                   if(res.data.code == 1){
                        alert("注册成功")
                       location.href = 'index.html'
                   }
                }).catch(function(err){
                    //请求失败
                    console.log(err)
                })
            }
            let ipt = document.getElementById("misc-b");
        ipt.onclick = function(){
        let name = document.getElementById("misc-n").value
        let word = document.getElementById("misc-p").value
        let reg = 'http://jx.xuzhixiang.top/ap/api/login.php'
            axios.get(reg,{
                params:{
                    username:name,
                    password:word
                }
            }).then(function(res){
                
                //请求成功
                   if(res.data.code == 1){
                        alert("登录成功")
                        console.log(res.data.data.id)
                        localStorage.setItem('uid',res.data.data.id)
                        localStorage.setItem('token',res.data.data.token)
                     location.href = 'index.html'
                   }
                }).catch(function(err){
                    //请求失败
                    console.log(err)
                })
            }
            
    </script>
    <script src="js/misc.js"></script>
</body>
</html>